<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>dom-event</title>
</head>
<body>
<div>div</div>
<form action="">form</form>
<span>span</span>
<!--  <div onclick="console.log('div')">-->
<!--    <button class="btn" onclick="console.log('btn')">dom0</button>-->
<!--  </div>-->
<!--  <button class="btn0" onclick="dom0()"></button>-->
<!--  <script>-->
<!--    function dom0() {-->
<!--      alert('dom0')-->
<!--    }-->
<!--    document.querySelector('.btn0').onclick = dom0-->
<!--  </script>-->
<!--  <button class="btn2">dom2</button>-->
<!--  <script>-->
<!--    let btn2 = document.querySelector('.btn2')-->
<!--    btn2.addEventListener('click', function () {-->
<!--      alert('dom2')-->
<!--    })-->
<!--  </script>-->
<!--<input type="text" id="inputText">-->
<!--<script>-->
<!--  inputText.oninput = function (e) {-->
<!--    const ev = e || window.event-->
<!--    // 去除空格-->
<!--    const val = this.value.replace(/^ +| +$/g, '')-->
<!--    const len = val.length-->
<!--    if(len >= 6) {-->
<!--      this.value = val.substr(0, 6)-->
<!--      let code = ev.which || ev.keyCode-->
<!--      // 排除DELETE/BACK/SPACE/方向键...-->
<!--      if (!/^(46|8|37|38|39|40)$/.test(code)) {-->
<!--        ev.preventDefault()-->
<!--      }-->
<!--    }-->
<!--  }-->
<!--</script>-->
<!--<form action="javascript:">-->
<!--  <input type="text" id="name">-->
<!--  <input type="text" id="password">-->
<!--  <button id="submit">提交</button>-->
<!--</form>-->
<!--<script>-->
<!--  const name = document.getElementById('name')-->
<!--  const password = document.getElementById('password')-->
<!--  submit.addEventListener('click', e => {-->
<!--    console.log(name.value)-->
<!--    if (!name.value.trim()) {-->
<!--      alert('you must input name')-->
<!--      e.stopImmediatePropagation()-->
<!--    }-->
<!--    if (!password.value.trim()) {-->
<!--      alert('you must input pwd')-->
<!--      e.stopImmediatePropagation()-->
<!--    }-->
<!--  }, false)-->
<!--  submit.addEventListener('click', function () {-->
<!--    alert('done finish')-->
<!--  })-->
<!--</script>-->
<!--<ul>-->
<!--  <li><span>1</span><span>删除</span></li>-->
<!--  <li><span>2</span><span>删除</span></li>-->
<!--  <li><span>3</span><span>删除</span></li>-->
<!--  <li><span>4</span><span>删除</span></li>-->
<!--  <li><span>5</span><span>删除</span></li>-->
<!--</ul>-->
<!--<script>-->
<!--  const ul = document.querySelector('ul')-->
<!--  ul.addEventListener('click', e => {-->
<!--      console.log(e.currentTarget)-->
<!--      console.log(e.target)-->
<!--      e.stopPropagation()-->
<!--      remove(ul, e.target)-->
<!--  })-->
<!--  function remove(parent, target, cb) {-->
<!--    if (target.parentElement === parent) {-->
<!--      parent.removeChild(target)-->
<!--    } else {-->
<!--      remove(parent, target.parentNode)-->
<!--    }-->
<!--  }-->
<!--</script>-->
<!--<button>开始游戏</button>-->
<!--<script>-->
<!--  // main.js-->
<!--  const btn = document.querySelector('button')-->
<!--  btn.addEventListener('click', function() {-->
<!--      document.dispatchEvent(new Event('gameStart'))-->
<!--      console.log('开始加载图片资源...')-->
<!--      console.log('开始加载音频资源...')-->
<!--  })-->
<!--  // load-image.js-->
<!--  document.addEventListener('gameStart', function () {-->
<!--    setTimeout(() => {-->
<!--      document.dispatchEvent(new Event('imageLoaded'))-->
<!--    }, 500)-->
<!--  })-->
<!--  // load-music.js-->
<!--  document.addEventListener('gameStart', function() {-->
<!--      setTimeout(() => {-->
<!--        document.dispatchEvent(new Event('musicLoaded'))-->
<!--      }, 1000)-->
<!--  })-->
<!--  // init-scene.js-->
<!--  document.addEventListener('imageLoaded', () => {-->
<!--    console.log('图片加载完毕!')-->
<!--    console.log('创建场景...')-->
<!--  })-->
<!--  document.addEventListener('musicLoaded', () => {-->
<!--    console.log('音频加载完毕!')-->
<!--    console.log('创建音效...')-->
<!--  })-->
<!--</script>-->
<!--<button>1231231</button>-->
<!--<script>-->

<!--  const btn = document.querySelector('button')-->
<!--  btn.addEventListener('click', (e) => {-->
<!--    e.stopPropagation()-->
<!--  }, false)-->
<!--  document.addEventListener('click', (e) => {-->
<!--    console.log(e, 'doc')-->
<!--  })-->
<!--</script>-->
<!--<form action="javascript:">-->
<!--  <input type="text" id="name">-->
<!--  <input type="text" id="password">-->
<!--  <button id="submit">提交</button>-->
<!--</form>-->
<!--<script>-->
<!--  const name = document.getElementById('name')-->
<!--  const password = document.getElementById('password')-->

<!--  // 输入检查-->
<!--  submit.addEventListener('click', e => {-->
<!--    console.log(name.value)-->
<!--    if (!name.value.trim()) {-->
<!--      alert('you must input name')-->
<!--      return e.stopImmediatePropagation()-->
<!--    }-->
<!--    if (!password.value.trim()) {-->
<!--      alert('you must input pwd')-->
<!--      return e.stopImmediatePropagation()-->
<!--    }-->
<!--  }, false)-->
<!--  // // 输入检查-->
<!--  // submit.addEventListener('click', e => {-->
<!--  //   console.log(name.value)-->
<!--  //   if (!name.value.trim()) {-->
<!--  //     alert('you must input name')-->
<!--  //     e.stopImmediatePropagation()-->
<!--  //   }-->
<!--  //   if (!password.value.trim()) {-->
<!--  //     alert('you must input pwd')-->
<!--  //     e.stopImmediatePropagation()-->
<!--  //   }-->
<!--  // }, false)-->
<!--  // 提交-->
<!--  submit.addEventListener('click', function () {-->
<!--    alert('done finish')-->
<!--  })-->
<!--</script>-->
</body>
</html>
